@import '../../../assets/scss/common.scss';

$skeletonColor:#f2f2f2;

.container{
    height: 100vh;
    background-color: $page-background-color;
}

.title{
    padding:60px $space;
    font-size: 36px;
}

.swiper{
    $h : 630px;
    height: $h;

    .typeItem{
        height: $h;
        padding: 20px $space;
        .wrap{
            height: 100%;
            padding: 20px $space;
            background-color: #fff;
            .row{
                height: ($h - 20px * 2 - 20px * 2) / 4;
                position: relative;
            }
        }
    }
}



.textLine{
    height: 35px;
    background-color: $skeletonColor;
}

.imageTextLine{
    display: flex;
    align-items: center;
    .image{
        width: 80px;
        height: 80px;
        border-radius: 50%;
        background-color: $skeletonColor;
    }
}

.gridType{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;

    .item{
        &::before{
            content: '';
            display: block;
            padding-bottom: 100%;
        }
        background: $skeletonColor;
    }
}